<{php}>
if(isset($config['product_index_seo_title']['cvalue'])){
$title = $config['product_index_seo_title']['cvalue'];
}
if(isset($config['product_index_seo_keywords']['cvalue'])){
$keywords = $config['product_index_seo_keywords']['cvalue'];
}
if(isset($config['product_index_seo_desc']['cvalue'])){
$description = $config['product_index_seo_desc']['cvalue'];
}
<{/php}>

<{include file="../template/public/head.html"}>
<link rel="stylesheet" type="text/css" href="/static/css/css.css" />
<script type="text/javascript" src="/static/js/jquery.SuperSlide.2.1.1.js"></script>
<script type="text/javascript">
    /*$(document).ready(function() {
     $(".hover-fadeIn").mouseover(function (){
     $(this).children('.img-hover-a').hide();
     }).mouseout(function (){
     $(".img-hover-a").show();
     });
     })*/
</script>
<style type="text/css">
    .hover-fadeIn .imgbox a{display:inline;}
    .full {
        width: 100%;
        height: 100%;
    }
    .page-control {
        position: absolute;
        top: 50%;
        width: 56px;
        height: 100px;
        margin-top: -50px;
    }
    .left {
        left: 0;
    }
    .right {
        right: 0;
    }
    .about-arrow{ font-size: 50px; clip: auto; overflow: visible; }
    .about-arrow img{ opacity: 0.8; }
    .about-arrow img:hover{ opacity: 1; }
    .pd-0{padding:0;}
    .bg{ background-color: white; border: 1px solid #eaedf2; }
    .pro-complex-banner{
    	background:url(<{if condition="isset($config.product_index_banner.cvalue)"}><{$config.product_index_banner.cvalue}><{/if}>);
    	background-size:100% 100%;
		}
    @media (max-width: 1200px) {
        .pro-complex-banner{
            display:none;
            background: url(<{if condition="isset($config.product_index_banner.cvalue)"}><{$config.product_index_banner.cvalue}><{/if}>) no-repeat center center !important;
        }
    }
    .small-none{
        display:none;
    }
    @media (max-width:767px){

        .hover-fadeIn .img-hover{
            opacity: 1;
        }
        .hover-fadeIn .hover-text{
            opacity: 1;
            transform: scale(1,1);
        }
        .hover-fadeIn .hover-text a:first-child{
            opacity:1;
            display:inline;
            font-size:14px;
        }
        .hover-fadeIn .hover-text a {
            display:none;

        }
        .pro-complex-banner{
            height:auto;
        }
        .small-none{
            display:block;
        }
    }
	.white{color:white !important;}

</style>



<!-- header-->
<!-- pro_top -->
<{include file="../template/public/union_nav.html"}>
<script>
    $('link').each(function(){
        if($(this).attr('href').indexOf("css/style.css")>0){
            $(this).remove();
            return false;
        }
    });
</script>
<div class="container-fluid">
    <div class="row">
        <div class="banner pro-complex-banner  relative">
            <div class="container pro-complex-desc">
                <div class="text-center">
                    <h3 class="white"><{if condition="isset($config.product_index_title.cvalue)"}><{$config.product_index_title.cvalue}><{/if}></h3>
                    <p class="sub-title white"><{if condition="isset($config.product_index_desc.cvalue)"}><{$config.product_index_desc.cvalue}><{/if}></p>
                    <div class="box-container hidden-xs">
                        <div class="box pros-box">
                            <a href="javascript:;" data-target="#p" data-action="elemScroll">Our Products</a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

<{php}>
    $products = $query->getProductsForCat('sys_cat');
    $productCats = $query->getProductCat('sys');
<{/php}>
<section id="p">
    <div class="container pro-sec">
        <div class="text-center center-block pro-list">
            <h1>Reinforcement material</h1>
            <a href="<{php}> echo $query->U('index/product/syscat',true);<{/php}>" class="more"><{:lang('See more')}></a>
            <p class="head-desc">With one-stop advanced construction reinforcement materials manufacturing, six systems, including more than 30 strengthening materials, we make it easy for you to
                obtain the majority of products required in the majority of reinforcement projects. </p>
            <div class="row">
                <{volist name="$productCats" id="item"}>
                <div class="col-md-4 col-sm-4 col-xs-6 pro-item border-right border-bottom hover-fadeIn" id="pd-0">
                    <div class="imgbox">
                        <a href="javascript:;"><img src="<{$item.cover}>" alt="<{php}>echo $query->alt($item['cover']);<{/php}>" class="img-responsive center-block" style="display:inline;width:100%;"></a>
                    </div>
                    <div class="img-hover">
                       <!-- <h3><a href="/index/test/product_in_carbonfiberfabric"></a></h3>-->
                        <div class="hover-text">
                            <a href="<{php}> echo $query->U('index/product/syslist/id/'.$item['id'],true);<{/php}>"><{$item.name}></a>
                            <{if condition="!empty($item['sub'])"}>
                                <{volist name="item.sub" id="sub" key="partAgainKey"}>
                                    <{if condition="(isset($products[$sub['id']]))"}>
                                        <{volist name="$products[$sub['id']]" id="product"}>
                                            <a href="<{php}> echo $query->U('index/product/product/id/'.$product['id'],true);<{/php}>"><{$product.name}></a>
                                        <{/volist}>
                                    <{/if}>
                                <{/volist}>
                            <{/if}>
                        </div>
                    </div>
                </div>
                <{/volist}>
            </div>
        </div>
    </div>
</section>

<{php}>
    $funProducts = $query->getProductsForFuncat();
    $allProductsById = $query->getAllProduct();
    $funProductCats = $query->getProductCat('fun');
<{/php}>

<{volist name="funProductCats" id="item"}>
<section id="m">
    <div class="container pro-sec disOnScroll" data-animation="pulse" data-timeout="200">
        <div class="text-center center-block">
            <h1><{$item.name}></h1>
            <a href="<{php}> echo $query->U('index/product/funList/id/'.$item['id'],true);<{/php}>" class="more"><{:lang('See more')}></a>
            <p class="head-desc"><{$item.desc}></p>
            <div class="container  case_list">
                <div class="carousel slide" id="slider" data-ride="carousel">
                    <div class="carousel-inner picScroll-left" role="listbox">
                        <div class="item active">

                            <div class="row">
                                <{if condition="(!empty($item.sub))"}>
                                <{volist name="$item.sub" id="cat"}>
                                <div class="col-md-4 col-sm-4 col-xs-12 border-right-bold hover-fadeIn pd-0"  id="">
                                    <div lass="imgbox">
                                        <a href="javascript:;"><img src="<{$cat.cover}>" alt="<{php}>echo $query->alt($cat['cover']);<{/php}>" class="img-responsive center-block"></a>
                                    </div>
                                    <div class="img-hover-a">
                                        <!--<h3><a href="javascript:;"><{$cat.name}></a></h3>-->
                                    </div>
                                    <div class="img-hover">
                                        <div class="hover-text">
                                            <a href="<{php}> echo $query->U('index/product/funProductList/id/'.$cat['id'],true);<{/php}>"><{$cat.name}></a>
                                            <{if condition="(isset($funProducts[$cat['id']]))"}>
                                            <{volist name="$funProducts[$cat['id']]" id="in"}>
                                            <a href="<{php}> echo $query->U('index/product/product/id/'.$in,true);<{/php}>"><{$allProductsById[$in]['name']}></a>
                                            <{/volist}>
                                            <{/if}>

                                        </div>
                                    </div>
                                </div>
                                <{/volist}>
                                <{/if}>

                            </div>
                        </div>
                        <div class="hd">
                            <a class="left page-control next" role="button" data-slide="prev"> <span class="about-arrow"><img src="/static/images/arrow_left.jpg" alt="<{php}>echo $query->alt('/static/images/arrow_left.jpg');<{/php}>" /> </span> </a>
                            <a class="right page-control prev"  role="button" data-slide="next"> <span class="about-arrow"><img src="/static/images/arrow_right.jpg" alt="<{php}>echo $query->alt('/static/images/arrow_right.jpg']);<{/php}>" /></span> </a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</section>
<{/volist}>
<script type="text/javascript">
    jQuery(".picScroll-left ").slide({titCell:".hd ul",mainCell:".item .row",autoPage:true,effect:"leftLoop",autoPlay:true,vis:3,trigger:"click"});
</script>


<section class="pro_bottom_bg  ">
    <div class="container">
        <div class="text-center pro-complex-b-desc" style="margin-top: 50px;">
            <h1 class="white">Standardization, evaluation, serialization and differentiation</h1>
            <p class="white">The world top-level processing and manufacturing equipment is used throughout the production process, we will produce high-end and high-quality equipments with
                precision quality inspection instruments.</p>
            <div class="box-container">
                <div class="box pros-b-box"><a href="<{php}>echo $query->U('index/about/factory');<{/php}>">Production Capacity</a></div>
                <div class="box pros-b-box"><a href="<{php}>echo $query->U('index/service/index');<{/php}>">Service</a></div>
                <div class="box pros-b-box"><a href="<{php}>echo $query->U('/index/about/cooperation');<{/php}>">Who Choose Us?</a></div>
            </div>
        </div>
    </div>
</section>

<!--fixed sidebar-->
<{include file="../template/public/sidebar.html"}>
<{include file="../template/public/foot.html"}>